<template>
    <div class="leftAside">
        <!-- 
            router	是否使用 vue-router 的模式，启用该模式会在激活导航时以 index 作为 path 进行路由跳转	boolean
            unique-opened	是否只保持一个子菜单的展开	boolean
            default-active	当前激活菜单的 index	string
            
         -->
        <el-menu  :default-active="defaultActive" background-color="#545c64" unique-opened router text-color="#fff"
            active-text-color="#ffd04b">
            <el-menu-item index="/home">
                <i class="el-icon-menu"></i>
                <span slot="title">首页</span>
            </el-menu-item>
            <el-submenu v-for="item in $store.getters.getUser.menus" :key="item.id" :index="item.id.toString()">
                <template slot="title">
                    <i :class="item.icon"></i>
                    <span>{{ item.title }}</span>
                </template>
                <el-menu-item v-for="item1 in item.children" :key="item1.id" :index="item1.url">{{item1.title}}</el-menu-item>
            </el-submenu>
            

        </el-menu>
    </div>
</template>
<script>

export default {
    data() {
        return {
            defaultActive:'/home'
        }
    },
    methods: {},
    mounted(){
        // 刷新页面
        this.defaultActive = this.$route.path
    },
    computed:{
        
    }
}
</script>
<style lang="less" scoped>

.leftAside .el-menu{
    height: 650px;
}</style>